$f: 19.2;

body{
  background: #FAFAFA;
}

.home {
  .main{
     margin: 112/$f+vw 260/$f+vw;
     .links{
      display: flex;
      margin-bottom: 10/$f+vw;
      a,span{
        color: #B7B7B7;
        font-size: 14/$f+vw;
      }
      span{
        margin: 0 10/$f+vw;
      }
      p{
        color: #000;
        font-size: 14/$f+vw;
      }
     }
     .info{
      background: white;
      padding: 46/$f+vw 96/$f+vw;
      .t{
        color: #000;
        font-size: 48/$f+vw;
        font-weight: 600;
      }
      .tags{
        color: #666;
        font-size: 16/$f+vw;
        margin: 16/$f+vw 0 36/$f+vw 0;
        padding-bottom: 14/$f+vw;
        border-bottom: 1px solid #D8D9DC;
        span:nth-child(2){
          margin: 0 15/$f+vw;
        }
        svg{
          width: 20/$f+vw;
          display: inline-block;
           margin-left: 5/$f+vw;
           transform: translateY(2px);
           cursor: pointer;
        }
      }
      .html{
        color: #333;
        font-size: 16/$f+vw;
        line-height: 1.25;
        img{
          max-width: 100%;
        }
      }
      .notice{
        margin: 50/$f+vw 0 85/$f+vw 0;
        div{
          color: #333;
          font-size: 16/$f+vw;
          span{
            font-weight: bold;
          }
          &:first-child{
            margin-bottom: 15/$f+vw;
          }
        }
      }
      .pager{
        display: flex;
        justify-content: space-between;
        align-items: center;
        .prev{
          display: flex;
          align-items:center;
          svg{
            width: 5/$f+vw;
            display: block;
            path{
              transition: all 600ms;
            }
          }
          p{
            margin-left: 8/$f+vw;
            color: #000;
            font-size: 16/$f+vw;
            font-weight: 600;
            transition: all 600ms;
          }
          &:hover{
            svg{
              path{
                stroke: #1A53F0;
              }
            }
            p{
              color:#1A53F0;
            }
          }
        }
        .r{
          display: flex;
          align-items: center;
          .back{
            color: #666;
            font-size: 16/$f+vw;
            font-weight: 300;
            margin-right: 10/$f+vw;
          }
          .next{
            display: flex;
            align-items: center;
            svg{
              width: 5/$f+vw;
              display: block;
              path{
                transition: all 600ms;
              }
            }
            p{
              margin-right: 8/$f+vw;
              color: #000;
              font-size: 16/$f+vw;
              transition: all 600ms;
              font-weight: 600;
            }
            &:hover{
              svg{
                path{
                  stroke: #1A53F0;
                }
              }
              p{
                color:#1A53F0;
              }
            }
          }
        }
      }
     }
  }
  @media screen and (max-width: 1024px){
    .main{
      margin: 70px 5%;
      .links{
        margin-bottom: 10px;
        a,span,p{
          font-size: 16px;
        }
        span{
          margin: 0 8px;
        }
      }
      .info{
        padding: 15px;
        .t{
          font-size: 18px;
        }
        .tags{
          font-size: 14px;
          margin: 5px 0 10px 0;
          padding-bottom: 20px;
          line-height: 1.6;
          span{
            display: block;
          }
          span:nth-child(2){
            margin-left: 0;
          }
          svg{
            width: 20px;
            height: auto;
            margin-left: 0;
          }
        }
        .html{
          font-size: 16px;
          line-height: 1.8;
        }
        .notice{
          margin: 25px 0;
          div{
            font-size: 16px;
            line-height: 1.8;
            &:first-child{
              margin-bottom: 0;
            }
          }
        }
        .pager{
          .prev{
            svg{
              width: 5px;
            }
            p{
              font-size: 16px;
              margin-left: 8px;
            }
          }
           .r{
            .back{
              font-size: 16px;
              margin-right: 10px;
            }
            .next{
              svg{
                width: 5px;
              }
              p{
                font-size: 16px;
                margin-right: 8px;
              }
            }
           }
        }
      }
    }
  }
}